<template>
	<view class="contentB">
		<view class="title">
			子组件B
		</view>
		<view class="a-box">
			<text>CompA组件传进来的值：</text>
			<text style="font-weight: bold;color:red">{{intent}}</text>
		</view>
		<view class="b-box" style="margin: 10rpx;">
			<text>回传值：</text>
			<input type="text" v-model="callbackValue" style="color:yellow;" />
			<button @click="sendOutside()" size="mini">回传</button>
		</view>
	</view>
</template>

<script>
	export default {
		name: "compB",
		data() {
			return {
				callbackValue: '',
				intent:''
			};
		},
		created() {
			console.log("-----compB----");
			uni.$on('fasong', (msg) => {
				console.log("处理回调" + msg);
				this.intent = msg;
			})
		},
		mounted() {
			console.log("mounted comB");
		},
		methods: {
			sendOutside() {
				console.log("----compB-----" );
				this.$emit('callBackFun', this.callbackValue);
			}

		}
	}
</script>

<style>
	.contentB {
		margin-top: 50rpx;
		margin-left: 20rpx;
		background-color: #6ec556;
		margin-right: 20rpx;
		padding: 20px;
		display: flex1;

	}

	.title {
		font-size: 50rpx;
		text-align: center;
		margin: 10rpx;
	}
.a-box{
	margin-top: 10rpx;
}
	.b-box {
		display: flex;
		align-items: center;
		margin: 20rpx;
	}
	input{
		background-color: #a2a2a2;
		width: 350rpx;
		margin-right: 10rpx;
	}
</style>